﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!--/*
    This file is part of Twitiriqui.

    Twitiriqui is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Twitiriqui is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Twitiriqui.  If not, see <http://www.gnu.org/licenses/>.
  
    Copyright 2009 Alberto Avila

*/
-->
<html>
	<head>
		<title></title>
		<style type="text/css">
            * {
                margin:0;
                padding:0;
            }

		    #messages img {
		    	height: 48px;
		    	width: 48px;
		    	vertical-align: middle;
		    	margin-right: 5px;
                -ms-interpolation-mode:bicubic;
		    }
		    #messages p
		    {
		    	border-top: 1px dashed #D2DADA;
		    	clear: both;
		    }
		    
		    #messages
		    {

		    }
		    .footer
		    {
		    	cursor: pointer;
		    	text-decoration: underline;
		    	color: Blue;
		    	clear: both;
		    	display: block;
		    	margin-left: 48px;
		    }
		    .reply
		    {
		    	cursor: pointer;
		    	text-decoration: underline;
		    	color: Blue;
		    }
		    .image
		    {
		    	display: block;
		    	float: left;
		    }
		</style>
		<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
		<script language="javascript" type="text/javascript" src="js/jquery.scrollTo.js"></script>
		<script language="javascript" type="text/javascript">
	        $(document).ready(function () {
	            
	            
	        });	
		   
		    
		    function appendMessage (screenName, imageUrl, text, id, inReplyToId, inReplyToUser)
		    {
		    	insertMessage (true, screenName, imageUrl, text, id, inReplyToId, inReplyToUser, false);
		    }
		    
		    function prependMessage (screenName, imageUrl, text, id, inReplyToId, inReplyToUser)
		    {
		        insertMessage (false, screenName, imageUrl, text, id, inReplyToId, inReplyToUser, false);
		    }
		    
		    function addTemporalReplyMessage (screenName, imageUrl, text, id, inReplyToId, inReplyToUser)
		    {
		        insertMessage (false, screenName, imageUrl, text, id, inReplyToId, inReplyToUser, true);
		    }
		    
		    function insertMessage (isAppend, screenName, imageUrl, text, id, inReplyToId, inReplyToUser, temporal)
		    {
		        var data = (
		            "<p id='r@id' type='@type'><span class='image'><img src='@url'/></span><span class='status'>@screenName: @text</span>"
		            .replace (/@url/g, imageUrl)
		            .replace (/@screenName/g, screenName)
		            .replace (/@text/g, text)
                );
                
                data = (data
                    .replace (/@id/g, id)
                    .replace (/@type/g, temporal ? "temporal" : "permanent")
               ); //IE goes crazy with too many .replace() chained
               
               data += "<span class='reply' rid='@id' rs='@screenName'>Reply</span>".replace (/@id/g, id).replace (/@screenName/g, screenName)
		       
		       if (inReplyToId != 0)
		            data += "<span class='footer' sid='r@id'>in reply to @user</span>"
		                .replace (/@id/g, inReplyToId)
		                .replace (/@user/g, inReplyToUser);
		              
                data += "</p>";
                
                $("#r" + id + "[type=\"temporal\"]").remove ();
                
                if (isAppend)
                    $("#messages").append (data);
                else
                    $("#messages").prepend (data);
                
                $(".footer").unbind ("click").click (function ()
                {
                    var targetID = "#" + $(this).attr ("sid");
                    if ($(targetID).length > 0)
                        $.scrollTo (targetID, 500); 
                    else; //get post
                });
                
                $(".reply").unbind ("click").click (function ()
                {
                    document.location.href = "twitiriqui://reply/@id/@screenName".
                        replace (/@id/g, $(this).attr("rid")).replace (/@screenName/g, $(this).attr("rs"));
                });
		    }
		    
		    
		</script>
	</head>
	<body>
	<p><a href="twitiriqui://updateTimeline">Newer</a></p>
	    <div id="messages">
	    </div>
	    <p><a href="twitiriqui://getPreviousMessages/">Older</a></p>
	</body>
</html>